<template>
  <div>
    <el-button type="primary" icon="el-icon-plus" @click="add">添加分类</el-button>
    <hr />
    <!-- 主要内容 -->

    <el-table :data="tableData" style="width: 100%">
      <el-table-column type="expand">
        
      </el-table-column>
      <el-table-column label="商品 ID" prop="id"> </el-table-column>
      <el-table-column label="商品名称" prop="name"> </el-table-column>
      <el-table-column label="描述" prop="desc"> </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button size="mini" @click="handleEdit(scope.$index, scope.row)"
            >编辑</el-button
          >
          <el-button
            size="mini"
            type="danger"
            @click="handleDelete(scope.$index, scope.row)"
            >删除</el-button
          >
          <el-button
            size="mini"
            type="success"
            @click="handleplus(scope.$index, scope.row)"
            >添加</el-button
          >
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        {
          id: "12987122",
          name: "好滋好味鸡蛋仔",
          category: "江浙小吃、小吃零食",
          desc: "荷兰优质淡奶，奶香浓而不腻",
          address: "上海市普陀区真北路",
          shop: "王小虎夫妻店",
          shopId: "10333",
        },
      ],
    };
  },
  methods: {
    handleEdit(index, row) {

    },
    handleDelete(index, row) {
     rows.splice(index, 1);
    },
    handleplus( index,row){

    },
    add(){//添加一级分类
this.$prompt('请输入分类名称', '提示', {
          confirmButtonText: '添加',
          cancelButtonText: '取消',
          closeOnClickModal: false
        }).then(({ value }) => {
          this.$http({
            path: this.$api.Classify.add,
            method: 'post',
            params: {
              cid: this.count + 1,
              cname: value
            }
          }).then(res=>{
            console.log(1111)
            this.$message({
              
              type: res.code === 200 ?'success':'error',
              message: res.msg
            });
            if(res.code === 200){
              this.getData()
            }
          })
        }).catch(() => {});
    }
  },
};
</script>

<style scoped>
.demo-table-expand {
  font-size: 0;
}
.demo-table-expand label {
  width: 90px;
  color: #99a9bf;
}
.demo-table-expand .el-form-item {
  margin-right: 0;
  margin-bottom: 0;
  width: 50%;
}
</style>